<template>
	<view class="x-logo-bg">
		<template name="bg">
			<view class="bg"></view>
			<image src="@/static/logo_rect.png" class="logo" mode="widthFix"></image>
			<image src="@/static/rule/rule_front.png" class="front-img" mode="widthFix"></image>
		</template>
		<view class="content">
			<slot></slot>
		</view>
	</view>
</template>

<script>
	export default {
		components: {

		},
		data() {
			return {

			}
		}
	}
</script>

<style lang="scss" scoped>
	.x-logo-bg {
		z-index: -1;
		
		.bg {
			background-color: #000;
		}
		
		.logo {
			width: 244rpx;
			position: absolute;
			left: 30rpx;
			top: 80rpx;
		}

		.front-img {
			position: absolute;
			right: 0rpx;
			top: 0rpx;
		}
		.content {
			position: absolute;
			z-index: 1;
		}
	}
</style>